<!DOCTYPE html>

<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>滚</title>
        <style type="text/css">
            .wrapper { border: 1px solid blue ; width : 80% ; margin: 50px auto ;}
            .wrapper marquee {  border: 1px solid red ; height: 100px ; }
        </style>
    </head>
    <body>

        <div class="wrapper">
            <marquee direction="left"
                            behavior="scroll"
                            loop="-1"
                            scrollamount="100"
                            scrolldelay="1">
                蛤蟆
            </marquee>
        </div>

        <a href="https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/marquee">marquee (MDN Docs)</a>

        <h3>练习:</h3>
        <p>【公告】使用 marquee 实现 从下向上滚动的公告内容</p>
        <p>【链接】使用 marquee 实现 从下向上滚动的 链接，每行一个链接</p>
        <p>【图片】使用 marquee 实现 从右向左 滚动的图片</p>
        <p>【图片】使用 marquee 实现 从下向上 滚动的图片 (每个图片独占一行)</p>

    </body>
</html>